{% extends "base.html" %} <!-- ctrl+r  替换 -->
{% block content %}
  <div class="posts">
    {% for article in article_list %}
      <section class="post">
        <header class="post-header">
          <h2 class="post-title"><a href="{% url 'detail' id=article.id %}">{{ article.title }}</a></h2>
          <p class="post-meta">
            发布时间：<a class="post-author" href="#">{{ article.pub_time |date:'Y/m/d H:M:S' }}</a>&nbsp;&nbsp;
            分类：<a class="post-category post-category-pure" href="#">{{ article.category }}</a>&nbsp;&nbsp;
            标签：
            {% for tag in article.tags.all %}
              <a class="post-category post-category-pure" href="#">{{ tag }}</a>
            {% endfor %}&nbsp;&nbsp;
            浏览次数：{{ article.views }}
          </p>
        </header>

        <div class="post-description">
          <p>
            {# 小坑：冒号后不能有空格，否则报cant'parser错误。建议前端尽量减少逻辑，放到views.py中完成 #}
            {{ article.content | truncatewords_html:100 }}
          </p>
        </div>

        <div>
          <!-- 小坑：article_id=article.id -->
          <a class="post-category post-category-design" href="{% url 'detail' id=article.id %}">阅读</a>
        </div>

      </section>
    {% endfor %}
  </div>  <!-- /.blog-post -->

  <!--页码-->
  <div>
    <a class="footer" href="#"><i class="fa fa-angle-left"></i>上一页</a>
    <button>{{ page_no }}</button>
    <a class="footer" href="#">下一页<i class="fa fa-angle-right"></i></a>
  </div>
{% endblock %}
